const { override: ccOverride, fixBabelImports, addPostcssPlugins, addWebpackAlias, adjustStyleLoaders, overrideDevServer   } = require('customize-cra');
const px2rem = require('postcss-px2rem-exclude');
const path = require("path")

process.env.GENERATE_SOURCEMAP = "false";

const addProxy = proxy => config => {
    return {
        ...config,
        proxy: proxy
    }
}

module.exports = {
    webpack: function(config, env) {
        ccOverride(
            fixBabelImports('import', {
                libraryName: 'antd-mobile',
                style: 'css',
            }),
            addPostcssPlugins([
                require('postcss-aspect-ratio-mini')({}),
                px2rem({remUnit: 37.5})       // remUnit: 1rem = x像素，一般设置为设计稿宽度的1/10
            ]),
            addWebpackAlias({ //路径别名
                '@': path.resolve(__dirname, 'src'),
            }),
            adjustStyleLoaders(rule => {
                if (rule.test.toString().includes("scss")) {
                    rule.use.push({
                        loader: require.resolve("sass-resources-loader"),
                        options: {
                            resources: "./src/style/variables.scss" //这里是你自己放公共scss变量的路径
                        }
                    });
                }
            })

        )(config, env);

        return config;
    },
    devServer: overrideDevServer(
        addProxy({
            '/': {
                target: 'http://localhost:8000',
            },
        })
    ),
}